$(function () {
    //载入头部内容
    $("header").load("header.html")


    $.get("api/articleList", function (data) {
        //获取推荐的文章信息
        for (var i = 0; i < data.length; i++) {
            $(".content-left").append(`            <div class="content-left-or">
                <div class="or-fir">
                    <div class="or-fir-left">
                        <a href="./blog.html?id=${data[i]._id}">
                            <h4 class="log-title">${data[i].title}</h4>
                        </a>
                        <span class="log-desc">${data[i].desc}</span>
                    </div>
                </div>
            </div>`)
        }

    })
    $.get("api/authorsList", function (result) {
        //获取推荐的作者信息
        for (var i = 0; i < result.data.length; i++) {
            $(".content-r").append(`                    <li>
            <img class="rauth-src" alt="">
            <div class="rauth">
                <h5 class="rauth-name"></h5>
                <span class="rauth-desc"></span>
            </div>
        </li>`)

            $(".rauth-name").eq(i).text(result.data[i].userName)
            $(".rauth-desc").eq(i).text(result.data[i].desc)
            $(".rauth-src").eq(i).attr("src", "../images/" + result.data[i].headImg)
        }
    })
    //该标志用于判断是否为第一次点击换一批
    var isa = false
    $("#change").click(function(event){
        //阻止a标签的默认效果
        event.preventDefault()
        if (isa == false) {
            //删除原先的三个
            $(".content-r").empty()

            for (var i = 0; i <= 3; i++) {
                $(".content-r").append(`                    <li>
                <img class="rauth-src" alt="">
                <div class="rauth">
                    <h5 class="rauth-name"></h5>
                    <span class="rauth-desc"></span>
                </div>
            </li>`)
            }
        }
        isa=true
        $.get("api/authorsList", function (result) {
            //获取推荐的作者信息
            for (var i = 0; i < 4; i++) {

                $(".rauth-name").eq(i).text(result.data[i].userName)
                $(".rauth-desc").eq(i).text(result.data[i].desc)
                $(".rauth-src").eq(i).attr("src", "../images/" + result.data[i].headImg)
            }
        })

    })
})